Creación de objetos propios
Se pueden definir y crear objetos propios para describir información
Se definen, estableciendo su propiedades y sus métodos
Casa
# de cuartos
metros cuadrados
precio
define_precio()
Se crean, generando instancias y asignando valores
Incorporación a HTML
La incorporación se hace con la etiqueta SCRIPT
Código en JavaScript
Atributos de la etiqueta SCRIPT
SRC
Especifica el URL del archivo con JavaScript, de no estar en la misma página. El archivo deberá tener la extensión .js
LANGUAGE
Especifica el lenguaje de guiones utilizado, ya que JavaScript no es el único que se puede utilizar
Ocultamiento de guiones
Algunos navegadores no soportan scripts, por lo que ignorarán la marca , pero no el contenido
Solución: ocultarlo como comentario
<script language="JavaScript">
<!– Ocultar guion
Programa en JavaScript
// fin de ocultamiento –>
Un ejemplo de un script
Un ejemplo
Aquí hay un script:
<!– Ocultar
// Salida "Funciona!"
document.writeln( "Funciona!<br>" );
//Dejar de ocultar –>
Title: Bloques de comandos
Body: Se pueden agrupar comandos utilizando las llaves { y }
{
comando
comando
}
Title: Bloques de comandos
Body: Los bloques se pueden anidar
{
un comando
{
otro comando
otro comando
}
}
Title: Salida de texto
Body: La función básica de casi cualquier programa es producir texto con resultados
En JavaScript, la operación básica es la salida de texto en la ventana del navegador
Se utilizan dos comandos
document.write( )
document.writeln( )
Se pueden incluir marcas
document.write( "Hola" );
Title: Ventanas de diálogo
Body: Hacen aparecer ventanas adicionales con mensajes o entradas de datos
Advertencia:
alert( "Haz click en OK para continuar" );
Entrada:
prompt( "¿Cuál es tu color favorito?", "azul" );
document.write( prompt( "Tu edad", "19" ) );
Title: Tipos de datos
Body: Para representar la información, se utilizan cuatro tipos de dato
Números
17, 21.3, 34e3 (decimales)
056 (octal)
0x5F (hexadecimal)
Cadenas
"Hola!"
Boleanos
true
false
Nulos
null
Title: Variables
Body: Son identificadores que pueden contener valores, y éstos pueden variar su valor
No es preciso declararlas, pero se recomienda
Declaración
var ejemplo;
Declaración y asignación
var ejemplo = "Hola";
Asignación
ejemplo = "Hola";
Invocación
document.write( ejemplo );
Title: Expresiones
Body: Colección de variables, operadores y otras expresiones que se evalúan a un solo valor
Asignación
asigna un valor a una variable
Aritméticas
evalúan un número
Cadenas
evalúan una cadena
Lógicas
evalúan un valor booleano
Title: Expresiones de asignación
Body: variable = expresión
Evalúa la expresión, y el resultado se asigna a la variable
variable += expresión
Evalúa la expresión, y el resultado mas el valor de la variable se asigna a la variable
Title: Operadores aritméticos
Body: + Suma
– Resta
* Multiplicación
/ División
% Módulo (residuo de una división)
Ejemplo
meses = edad * 12;
Combinados
suma += dato;
Title: Operadores lógicos
Body: &&
"y" lógico, devuelve true cuando ambos operandos son verdaderos y falso en otro caso
||
"o" lógico, devuelve true cuando alguno de los operandos es verdadero
!
"no" lógico, devuelve true si el operando es falso, y false si el operando es verdadero
Title: Operadores de comparación
Body: ==
iguales, devuelve verdadero si los operandos son iguales
!=
diferentes
>
<
>=
Title: Funciones: un ejemplo (cont)
Body:
Title: Eventos
Body: Señales generadas cuando ocurren acciones específicas
Brindan la base para la interactividad
Se disparan en el visualizador por acciones del usuario (principalmente)
Se pueden construir acciones que reacciones a los eventos
Title: Eventos
Body: Ejemplos de eventos:
blur
Cuando el usuario hace click fuera de un campo en un formulario
click
Cuando el usuario hace click en una liga o en un elemento de un formulario
change
Cuando el usuario cambia el valor de un campo
focus
Cuando se activa el foco en una entrada
load
Cuando se carga una página del navegador
Title: Eventos
Body: Más ejemplos
mouseover
Cuando el cursor (ratón) pasa por encima de una liga
select
Cuando el usuario selecciona un campo de un elemento en un formulario
submit
Cuando el usuario envía un formulario
unload
Cuando un usuario abandona una página (para cerrar la ventana o cambiar de página)
Title: Eventos: manejadores
Body: Los manejadores de eventos son las instrucciones que se ejecutan cuando ocurre un evento
Poniendo funciones:
Poniendo varias instrucciones
Title: Eventos: palabra clave "this"
Body: Hace referencia al objeto que produjo el evento
Title: Eventos: onLoad y onUnload
Body: EjemploPágina efusiva
Title: Eventos: Guacamole
Body: onUnload=" window.open( 'maliciosa.html' );"
Title: Eventos: onMouseOver
Body:
Title: Posición de objetos y capas
Body: Podemos definir objetos y asignarles atributos de posición y capas (entre otras cosas)
Se utiliza la marca
Página anterior | Volver al principio del trabajo | Página siguiente |